<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    
	
	<title>_库存查询管理</title>
	<script type="text/javascript">
	
        $(function() {
        
		    $("#queryForm").validate(); 
		    
		    $('#_sku').hide();
	        $('#_stockCode').hide();
	        $('#skuTable').hide();
	        $('#stockCodeTable').hide();
	        $('#page_sku').hide();
	        $('#page_stockCode').hide();
	       
	        var flag='${_flag}';
	        if(flag==''){
	           change('sku');
	        }else{
	           change('${_flag}');
	        }
	        
        });
	        
	        
	    function showDetail(e){
	      var id=$(e).attr("id");
	      var info=id.split("_");
	      var customerCode=info[0];
	      var areagroupCode=info[1];
	      var sku=info[2];
	      
	      var name=$(e).attr("name");
	      var info2=name.split("_");
	      var customerName=info2[0];
	      var areagroupName=info2[1];
	      
	      $("#customerName").html(customerName);
	      $("#areagroupName").html(areagroupName);
	      $("#sku").html(sku);
	      
	      $.ajax({
			    type : 'post',
				url : '${ctx}/stock/stockDetail',
				data : {
					customerCode:customerCode,
					areagroupCode:areagroupCode,
					sku:sku
				},
				dataType : 'json',
				success : function(data) {
					var stockList = data.stockList;
					
					//库位信息
					$("#detail_content").html("");
					var str='';
					$.each(stockList, function(i) {
					   var stock=stockList[i];
					   str+="<tr>";
					   str+="<td>"+stock.stockCode+"</td>";
					   str+="<td>"+stock.salesNum+"</td>";
					   str+="<td>"+stock.unusedNum+"</td>";
					   str+="<td>"+stock.orderNum+"</td>";
					   str+="<td>"+stock.lockedNum+"</td>";
					   str+="<td>"+stock.transportNum+"</td>";
					   str+="<td>"+stock.airNum+"</td>";
					   str+="<td>"+stock.totalNum+"</td>";
					   str+="</tr>";
					});
					$("#detail_content").html(str);
					
				},
				error : function() {
					alert("网络繁忙，请稍后重试...");
				}
			}); 
	  }
	  
	  
	   function change(v){
	     $('#_flag').val(v);
	     if(v=='sku'){
	         $('#_sku').show();
	         $('#skuTable').show();
	         $('#page_sku').show();
	         
	         $('#_stockCode').hide();
	         $('#stockCodeTable').hide();
	         $('#page_stockCode').hide();
	          
	         $('#chooser_sku').attr('checked','checked');
	     }
	     else if(v=='stockCode'){
	         $('#_sku').hide();
	         $('#skuTable').hide();
	         $('#page_sku').hide();
	         
	         $('#_stockCode').show();
	         $('#stockCodeTable').show();
	         $('#page_stockCode').show();
	         
	         $('#chooser_stockCode').attr('checked','checked');
	     }
	  }
	  
	  function  query(){
	     var flag=$("#_flag").val();
	     
	     if(flag=="sku"){
	         $("#queryForm").attr("action",'${ctx}/stock/query_sku');
	     }else if(flag=="stockCode"){
	         $("#queryForm").attr("action",'${ctx}/stock/query_stockCode');
	     }
	     
         $("#queryForm").submit();
         
	  }
	  
    </script>
</head>

<body>
	
	<div style="height: 10px;"></div>
	
	<div class="row">
		<div class="span12" style="margin-left: 20px;">
			<form class="form-search" id="queryForm"  method="post">
			
			 	<label style="margin-left:10px;">商家：</label> 
				<select  name="_customerCode"  id="_customerCode" value="${param._customerCode}" class="input-medium required" >
					<option value=""></option>
					<c:forEach items="${customersList}" var="customer">
						<option value="${customer.customerCode}"
						<c:if test="${param._customerCode eq customer.customerCode}">selected=selected</c:if>
						>${customer.customerName}</option>
					</c:forEach>
				</select>
				
				<label style="margin-left:10px;">仓库网点：</label> 
				<select  name="_areagroupCode"  id="_areagroupCode" value="${param._areagroupCode}"  class="input-medium">
					<option value=""></option>
					<c:forEach items="${areagroupList}" var="areagroup">
						<option value="${areagroup.groupCode}"
						<c:if test="${param._areagroupCode eq areagroup.groupCode}">selected=selected</c:if>
						>${areagroup.groupName}</option>
					</c:forEach>
				</select>
				
				<input type="hidden" id="_flag" name="_flag" value="${_flag}">
				<input name="chooser" id="chooser_sku" type="radio" value="sku"   onchange="change('sku');" style="margin-left:20px;">SKU编码</input>
				<input name="chooser" id="chooser_stockCode" type="radio" value="stockCode" onchange="change('stockCode');"   style="margin-left:10px;">库位编码</input>
				
				<input type="text" name="_sku" id="_sku" class="input-medium" value="${param._sku}" style="margin-left:0px;"  >
				
				<input type="text" name="_stockCode" id="_stockCode" class="input-medium" value="${param._stockCode}" style="margin-left: 0px;">
				
			    <button type="button" class="btn" style="margin-left: 10px;" onclick="query();">搜索</button>
		    </form>
	    </div>
	</div>
	
	<!-- sku查询 -->
	<table id="skuTable" class="table table-striped table-bordered table-condensed">
		<thead><tr>
		    <th style="width: 100px;">商家名称</th>
		    <th style="width: 90px;">仓库网点</th>
		    <th style="width: 100px;">SKU编码</th>
		    <th style="width: 100px;">可销售库存</th>
		    <th style="width: 100px;">不可销售库存</th>
		    <th style="width: 100px;">订单占用库存</th>
		    <th style="width: 100px;">锁定库存</th>
		    <th style="width: 100px;">调拨占用库存</th>
		    <th style="width: 100px;">调拨中库存</th>
		    <th style="width: 100px;">库存总量</th>
		    <th>操作</th>
		</tr></thead>
		
		<c:if test="${page_sku ne null}">
			<c:forEach items="${page_sku.content}" var="stock">
				<tr>
				   <td>${stock.customer.customerName}</td>
				   <td>${stock.areagroup.groupName}</td>
				   <td>${stock.sku}</td>
				   <td>${stock.salesNum}</td>
				   <td>${stock.unusedNum}</td>
				   <td>${stock.orderNum}</td>
				   <td>${stock.lockedNum}</td>
				   <td>${stock.transportNum}</td>
				   <td>${stock.airNum}</td>
				   <td>${stock.totalNum}</td>
				   <td>
				     <a href="#detail" data-toggle="modal" class="btn btn-info "
				      name="${stock.customer.customerName}_${stock.areagroup.groupName}_${stock.sku}"
				      id="${stock.customer.customerCode}_${stock.areagroup.groupCode}_${stock.sku}" onclick="showDetail(this);">查看明细</a>
				   </td>
				</tr>
			</c:forEach>
			</c:if>
		</table>
		
		
		<c:if test="${page_sku ne null}" >
		  <div id="page_sku"><tags:pagination  page="${page_sku}" paginationSize="5" /></div>
		</c:if>
		
		
		
		
	<!-- stockCode查询 -->
	<table id="stockCodeTable" class="table table-striped table-bordered table-condensed" >
		<thead><tr>
		    <th style="width: 100px;">商家名称</th>
		    <th style="width: 90px;">仓库网点</th>
		    <th style="width: 100px;">库位编码</th>
		    <th style="width: 100px;">SKU编码</th>
		    <th style="width: 100px;">可销售库存</th>
		    <th style="width: 100px;">不可销售库存</th>
		    <th style="width: 100px;">订单占用库存</th>
		    <th style="width: 100px;">锁定库存</th>
		    <th style="width: 100px;">调拨占用库存</th>
		    <th style="width: 100px;">调拨中库存</th>
		    <th style="width: 100px;">库存总量</th>
		</tr></thead>
		
		<c:if test="${page_stockCode ne null}">
			<c:forEach items="${page_stockCode.content}" var="stock1">
				<tr>
				   <td>${stock1.customer.customerName}</td>
				   <td>${stock1.areagroup.groupName}</td>
				   <td>${stock1.stockCode}</td>
				   <td>${stock1.sku}</td>
				   <td>${stock1.salesNum}</td>
				   <td>${stock1.unusedNum}</td>
				   <td>${stock1.orderNum}</td>
				   <td>${stock1.lockedNum}</td>
				   <td>${stock1.transportNum}</td>
				   <td>${stock1.airNum}</td>
				   <td>${stock1.totalNum}</td>
				</tr>
			</c:forEach>
			</c:if>
		</table>
		
		
		<c:if test="${page_stockCode ne null}" >
		 <div id="page_stockCode"><tags:pagination page="${page_stockCode}" paginationSize="5"/></div>
		</c:if>
		
	
	
	
	
	<!-- 库存明细 -------------------------------------------------------------------------------------------------->
	<div style="display: none; width:880px;" class="modal hide fade"  id="detail" >
	<form id="inputForm"  method="post" class="form-horizontal">
	
		<!-- 头 -->
		<div class="modal-header" style="height: 0px;" ></div>
		<!-- 体 -->
		<div class="modal-body" style="height: 400px;">
		
		   <table class="table table-striped table-bordered table-condensed" >
        	  <thead>
			    <th style="color: white;" bgcolor="#8EB4CB">库存网点</th>
			    <th style="color: white;" bgcolor="#8EB4CB">商家</th>
			    <th style="color: white;" bgcolor="#8EB4CB">sku编码</th>
			  </thead>
	          <tr>
	             <td id="areagroupName"></td>
	             <td id="customerName"></td>
	             <td id="sku"></td>
	          </tr>
	        </table>  
		
			<table id="contentTable" class="table table-striped table-bordered table-condensed">
			<thead>
			<th style="vertical-align: middle; color: white;" bgcolor="#8EB4CB" colspan="8">库存信息</th>
			<tr>
			    <th style="width: 100px;">库位编码</th>
			    <th style="width: 100px;">可销售库存</th>
			    <th style="width: 100px;">不可销售库存</th>
			    <th style="width: 100px;">订单占用库存</th>
			    <th style="width: 100px;">锁定库存</th>
			    <th style="width: 100px;">调拨占用库存</th>
			    <th style="width: 100px;">调拨中库存</th>
			    <th>总量</th>
			</tr></thead>
			<tbody id="detail_content"></tbody>
			</table>		       
		      
		</div>
		<!-- 尾 -->
		<div class="modal-footer">
			<a class="btn btn-info" data-dismiss="modal" aria-hidden="true">返回</a>
		</div>
		
        </form> 
     </div>
     <!------------------------------------------------------------------------------------------------------------->
	
	
</body>
</html>
